html {
  height: 100%;
}

html,body {
  overflow-x: hidden;
}
.wrapper {
  position: relative;
  width: 100%;
  height: 100%;
  -webkit-transition: all .3s cubic-bezier(0.23,1,0.32,1);
  -o-transition: all .3s cubic-bezier(0.23,1,0.32,1);
  transition: all .3s cubic-bezier(0.23,1,0.32,1);
  &:before, &:after {
    content: " ";
    display: table
  }
  &:after {
    clear: both
  }
  > .aside {
    position: absolute;
    margin-top: 110px;
    top: 0;
    left: 0;
    bottom: 0;
    width: 250px;
    z-index: 10
  }
  > section {
    position: relative;
    background-color: #fff;
    min-height: 100%;
    z-index: 11;
    margin-left: 0
  }
}

.boxed-layout .wrapper {
  max-width: 1140px;
  margin: 0 auto;
  overflow: hidden;
  .aside,
  .navbar-top{
    position: absolute
  }
}

.content-wrapper {
  padding-bottom: 30px;
  overflow: auto;
  padding: 15px;
  > h3 {
    margin: -15px;
    margin-bottom: 20px;
    padding: 15px;
    font-weight: normal;
    background-color: #fafbfc;
    border-bottom: 1px solid #cfdbe2;
    small {
      display: block;
      font-size: 12px;
      color: #909fa7
    }
  }

}

@media only screen and (min-width: 768px) {
  .content-wrapper {
    padding:20px
  }

  .content-wrapper>h3 {
    margin: -20px;
    margin-bottom: 20px;
    padding: 20px
  }

  .content-wrapper>button,.content-wrapper>.btn {
    margin: 0
  }
}

@media only screen and (min-width: 768px) {
  body {
    min-height:100%
  }

  .wrapper>.aside {
    position: fixed;
    z-index: 501;
    margin-top: 55px
  }

  .wrapper>section {
    margin-left: 250px;
    padding-top: 55px
  }

  .wrapper>section.has-sidebar-right {
    margin-right: 250px
  }

  .wrapper>section.has-sidebar-right+.offsidebar {
    z-index: 1
  }
}

.aside-toggled {
  overflow-y: hidden;
  height: 100%
}

.aside-toggled .wrapper>section {
  margin-left: 250px
}

.csstransforms3d .wrapper>section {
  -webkit-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
  -webkit-transition: -webkit-transform .3s ease;
  -moz-transition: -moz-transform .3s ease;
  -o-transition: -o-transform .3s ease;
  transition: transform .3s ease
}

.csstransforms3d .aside-toggled .wrapper>section {
  margin-left: 0;
  -webkit-transform: translate3d(250px,0,0);
  transform: translate3d(250px,0,0);
  -webkit-transition: -webkit-transform .3s ease;
  -moz-transition: -moz-transform .3s ease;
  -o-transition: -o-transform .3s ease;
  transition: transform .3s ease
}

@media only screen and (min-width: 768px) {
  .aside-collapsed {
    overflow-y:auto
  }

  .aside-collapsed .wrapper>.aside {
    width: 70px
  }

  .aside-collapsed .wrapper>section {
    margin-left: 70px
  }

  .csstransforms3d .aside-collapsed .wrapper>section {
    -webkit-transform: none;
    -moz-transform: none;
    -opera-transform: none;
    -ms-transform: none;
    transform: none;
    margin-left: 70px
  }
}

.navbar-top {
  -webkit-backface-visibility: hidden;
  margin-bottom: 0;
  border-radius: 0
}

@media only screen and (min-width: 768px) {
  .navbar-top .navbar-header {
    width:250px;
    text-align: center
  }

  .navbar-top .navbar-header .navbar-brand {
    width: 100%
  }
}

.navbar-top {
  position: relative
}

.navbar-top .navbar-header {
  position: relative;
  background-color: #1c75bf;
  height: 55px;
  z-index: 11
}

.navbar-top .navbar-header .navbar-brand {
  padding: 0
}

.navbar-top .navbar-header .brand-logo>img,.navbar-top .navbar-header .brand-logo-collapsed>img {
  margin: 0 auto
}

.navbar-top .navbar-header .brand-logo {
  display: block;
  padding: 10px 15px
}

.navbar-top .navbar-header .brand-logo-collapsed {
  display: none;
  padding: 6px 15px
}

.navbar-top .navbar-nav>li>a,.navbar-top .navbar-nav>.open>a {
  color: #909090
}

.navbar-top .navbar-nav>li>a:hover,.navbar-top .navbar-nav>.open>a:hover,.navbar-top .navbar-nav>li>a:focus,.navbar-top .navbar-nav>.open>a:focus {
  color: #2a2a2a
}

.navbar-top .navbar-nav>.active>a,.navbar-top .navbar-nav>.open>a,.navbar-top .navbar-nav>.active>a:hover,.navbar-top .navbar-nav>.open>a:hover,.navbar-top .navbar-nav>.active>a:focus,.navbar-top .navbar-nav>.open>a:focus {
  background-color: transparent
}

.navbar-top .navbar-nav>li>[data-toggle='navbar-search'] {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 20;
  font-size: 16px;
  line-height: 55px;
  color: #fff;
  padding-top: 0;
  padding-bottom: 0;
  -webkit-transition: color .3s ease;
  -o-transition: color .3s ease;
  transition: color .3s ease
}

@media only screen and (min-width: 768px) {
  .navbar-top .navbar-nav>li>[data-toggle='navbar-search'] {
    color:#909090
  }
}

.nav-wrapper {
  padding: 0 15px;
  background-color: #fff
}

.nav-wrapper .nav.navbar-nav {
  float: left
}

.nav-wrapper .nav.navbar-nav.navbar-right {
  float: right
}

.nav-wrapper .nav>li {
  position: static;
  float: left
}

.nav-wrapper .navbar-nav .open .dropdown-menu {
  position: absolute;
  background-color: #fff;
  left: 0;
  right: 0;
  border-top: 1px solid #e1e1e1;
  border-bottom: 1px solid #e1e1e1
}

.navbar-top .navbar-form {
  position: absolute;
  top: -100%;
  left: 0;
  right: 0;
  margin: 0;
  padding: 0;
  height: 55px;
  z-index: 9001;
  -webkit-transition: all .3s;
  -o-transition: all .3s;
  transition: all .3s;
  border-bottom: 1px solid #e1e2e3
}

.navbar-top .navbar-form .form-group {
  height: 100%;
  width: 100%
}

.navbar-top .navbar-form .form-control {
  height: 100%;
  border: 0;
  border-radius: 0;
  width: 100%
}

.navbar-top .navbar-form.open {
  top: 0
}

.navbar-top .navbar-form .has-feedback .form-control-feedback {
  height: 30px;
  cursor: pointer;
  top: 50%;
  margin-top: -15px;
  line-height: 30px;
  margin-right: 10px;
  color: #c1c2c3;
  font-size: 1.5em;
  pointer-events: auto
}

@media only screen and (min-width: 768px) {
  .navbar-top .navbar-form {
    left:250px
  }
}

@media only screen and (min-width: 768px) {
  .navbar-top {
    position:fixed;
    top: 0;
    left: 0;
    right: 0;
    border: 0;
    background-color: #fff
  }

  .navbar-top .navbar-nav>a {
    box-shadow: 0 0 0 #000 inset;
    -webkit-transition: all .2s;
    -o-transition: all .2s;
    transition: all .2s
  }

  .navbar-top .navbar-nav>.open>a,.navbar-top .navbar-nav>.open>a:hover,.navbar-top .navbar-nav>.open>a:focus {
    box-shadow: 0 -3px 0 #1c75bf inset;
    -webkit-transition: all .2s;
    -o-transition: all .2s;
    transition: all .2s
  }

  .navbar-top .navbar-nav>li>a,.navbar-top .navbar-nav>.open>a {
    color: #909090
  }

  .navbar-top .navbar-nav>li>a:hover,.navbar-top .navbar-nav>.open>a:hover,.navbar-top .navbar-nav>li>a:focus,.navbar-top .navbar-nav>.open>a:focus {
    color: #444
  }

  .navbar-top .navbar-nav>li>[data-toggle='navbar-search'] {
    position: static
  }

  .nav-wrapper {
    position: relative;
    box-shadow: 0 1px 2px rgba(0,0,0,0.15);
    z-index: 10
  }

  .nav-wrapper:before,.nav-wrapper:after {
    content: " ";
    display: table
  }

  .nav-wrapper:after {
    clear: both
  }

  .nav-wrapper .navbar-nav .open .dropdown-menu {
    left: auto;
    right: auto
  }

  .nav-wrapper .navbar-nav.navbar-right .open .dropdown-menu {
    left: auto;
    right: 0
  }
}

@media only screen and (min-width: 768px) {
  .aside-collapsed .navbar-top .navbar-header .brand-logo {
    display:none
  }

  .aside-collapsed .navbar-top .navbar-header .brand-logo-collapsed {
    display: block
  }

  .aside-collapsed .navbar-top .navbar-header {
    width: 70px
  }

  .aside-collapsed .navbar-top .navbar-form {
    left: 70px
  }
}

.sidebar {
  background-color: #1d2933;
  height: 100%;
  overflow-y: auto;
  border-right: 1px solid #000
}

.sidebar>.nav {
  position: relative
}

.sidebar>.nav>.nav-heading:first-child {
  padding-top: 20px
}

.sidebar .nav-heading {
  padding: 12px 30px;
  color: #54738a;
  font-size: 13px;
  letter-spacing: .035em;
  text-indent: -10px;
  pointer-events: none
}

.sidebar .nav-labels {
  list-style-type: none;
  padding: 0;
  margin: 0
}

.sidebar .nav-labels>.nav-labels-item {
  padding: 5px 25px;
  font-size: 13px
}

.sidebar .nav-labels>.nav-labels-item>a {
  color: #638399
}

.sidebar .nav-labels>.nav-labels-item .circle {
  margin-right: 20px;
  margin-left: 0
}

.sidebar .nav>li {
  border-left: 2px solid transparent
}

.sidebar .nav>li>a,.sidebar .nav>li>.nav-item {
  padding: 14px 25px;
  color: #638399;
  letter-spacing: .025em;
  font-weight: 600;
  -webkit-transition: background-color .2s ease;
  -o-transition: background-color .2s ease;
  transition: background-color .2s ease
}

.sidebar .nav>li>a:focus,.sidebar .nav>li>.nav-item:focus {
  text-decoration: underline !important;
  color: #b0c0cc
}

.sidebar .nav>li>a>em,.sidebar .nav>li>.nav-item>em {
  width: 2em;
  color: inherit
}

.sidebar .nav>li.active,.sidebar .nav>li:hover,.sidebar .nav>li.active>a,.sidebar .nav>li:hover>a,.sidebar .nav>li.active>a>.item-text,.sidebar .nav>li:hover>a>.item-text,.sidebar .nav>li.active .nav,.sidebar .nav>li:hover .nav {
  background-color: #19242c;
  color: #b0c0cc
}

.sidebar .nav>li.active>a>em,.sidebar .nav>li:hover>a>em {
  color: #1c75bf
}

.sidebar .nav>li.active {
  border-left-color: #1c75bf
}

.sidebar .nav .nav {
  padding-left: 55px;
  background-color: #1d2933
}

.sidebar .nav .nav>li {
  border-left: 0
}

.sidebar .nav .nav>li>a,.sidebar .nav .nav>li>.nav-item {
  display: block;
  position: relative;
  padding: 10px 30px 10px 6px;
  background-color: transparent !important;
  font-weight: normal
}

.sidebar .nav .nav>li>a:focus,.sidebar .nav .nav>li>.nav-item:focus,.sidebar .nav .nav>li>a:hover,.sidebar .nav .nav>li>.nav-item:hover {
  color: #b0c0cc
}

.sidebar .nav .nav>li.active>a,.sidebar .nav .nav>li.active>.nav-item {
  color: #1c75bf
}

.sidebar .nav .nav>li.active>a:after,.sidebar .nav .nav>li.active>.nav-item:after {
  border-color: #1c75bf;
  background-color: #1c75bf
}

@media only screen and (min-width: 768px) {
  .aside-collapsed .sidebar {
    overflow:visible !important
  }

  .aside-collapsed .sidebar>.nav>.nav-heading {
    display: none !important
  }

  .aside-collapsed .sidebar>.nav>li>a>em {
    font-size: 1.6em;
    width: auto
  }

  .aside-collapsed .sidebar>.nav>li>a,.aside-collapsed .sidebar>.nav>li>.nav-item {
    padding: 20px 0;
    text-align: center
  }

  .aside-collapsed .sidebar>.nav>li>a .item-text,.aside-collapsed .sidebar>.nav>li>.nav-item .item-text {
    display: none;
    position: absolute;
    left: 100%;
    top: 0;
    margin-left: 1px;
    margin-top: 1px;
    padding-left: 20px;
    font-weight: bold;
    line-height: 40px;
    white-space: nowrap;
    z-index: 2002
  }

  .aside-collapsed .sidebar>.nav>li>a.no-submenu .item-text,.aside-collapsed .sidebar>.nav>li>.nav-item.no-submenu .item-text {
    display: none !important
  }

  .aside-collapsed .sidebar>.nav>li>a:focus {
    background-color: transparent
  }

  .aside-collapsed .sidebar>.nav>li>a:focus>em {
    color: inherit
  }

  .aside-collapsed .sidebar .nav-labels {
    display: none
  }

  .aside-collapsed .sidebar .nav .nav {
    display: none;
    position: absolute;
    top: 0;
    left: 100%;
    padding-left: 20px;
    padding-top: 40px;
    min-width: 220px;
    z-index: 2001;
    height: auto !important;
    box-shadow: 0 0 0 #000;
    border: 1px solid rgba(0,0,0,0.15)
  }

  .aside-collapsed .sidebar .nav>li:hover .nav,.aside-collapsed .sidebar .nav>li.open .nav {
    display: block
  }

  .aside-collapsed .sidebar .nav>li:hover .item-text,.aside-collapsed .sidebar .nav>li.open .item-text {
    display: block
  }

  .aside-collapsed .sidebar .nav .label {
    position: absolute;
    top: 10px;
    right: 5px
  }
}
